// config 商品说明
import { Text, View, Image } from '@tarojs/components';
import { useState , useEffect} from 'react';
import Taro, {useRouter, getCurrentInstance} from '@tarojs/taro';
import './groupXiangqing.scss';
// eslint-disable-next-line import/first
import { AtTabs, AtTabsPane, AtCountdown } from 'taro-ui';


const groupXiangqing = () => {
    const tabList = [{ title: '商品说明' }, { title: '拼团记录' }]
    const [current, setCurrent] = useState(0)
    const [val1,setVal1] = useState([{endTime: "2022-05-10T16:00:00.000+00:00",
gmDes: "吃饱饭",
gmNum: 10,
gmNums: 10,
gmPrice: 8,
gmRequiredTime: "5",
gmTt: "荔枝",
gmXg: 8,
goodsOldCost: 4,
groupCount: null,
pic1: "http://tmp/aey0Iv7sgsls77d1e63ef9d9f8055b12d0f553940e6d.png",
pic2: "http://tmp/rSK1wvetjOEE77d1e63ef9d9f8055b12d0f553940e6d.png",
pic3: "http://tmp/VHResndfDGDH77d1e63ef9d9f8055b12d0f553940e6d.png",
startTime: "2022-05-08T16:00:00.000+00:00",
state: 1,}])

    const toBianji = () =>{
        Taro.navigateTo({
            url: '/pages/Group/group_bianji/groupBianji',
            events: {
                acceptDataFromOpenedPage: function(data) {
                    console.log(data)
                  },
              },
              success: function(res) {
                // 通过eventChannel向被打开页面传送数据
                res.eventChannel.emit('acceptDataFromOpenerPage', { data: e })
              }
          })
    }
    const handleClick = (v) => {
        setCurrent(v)
    }

    const { router } = getCurrentInstance();
    console.log(router.params.key) // 参数接收

    useEffect(() => {
        // eventChannel.on('acceptDataFromOpenerPage', function(data) {
        //     console.log(data)
        //   })
        // console.log(router.params) // 参数接收
      
        let temp = val1
        for(let i=0;i<val1.length;i++){
          if(val1[i].state == "1"){
            temp[i].state = "进行中"
          }else if(val1[i].state == "0"){
            temp[i].state = "审核中"
          }else if(val1[i].state == "2"){
            temp[i].state = "已结束"
          }
          setVal1(temp)
        }
        // console.log(val1)
        // console.log(val1[0].state)
        // setVal1(store.s_jp.shop)
        // console.log(val1)
      },[]);
    return <View>
        {/* 商品图片信息 */}
        
        <View className='com_img'>
            <Image src='../../../static/img/dingdan.png'></Image>
            <View className='com_tishi'>进行中</View>
            <View className='com_text'>
                <View className='at-row text_one'>
                    <View className='at-col at-col-9'>
                        <Text className='t_people'>3人成团</Text>
                        <Text> 精品泰国桂圆 1000g/盒</Text>
                    </View>
                    <View className='at-col at-col-3 text_right'>
                        <Text>￥7.8</Text>
                        <Text className='del_line'> ￥14.6</Text>
                    </View>
                </View>
                <View className='at-row text_two'>
                    <Text className='at-col at-col-8'>已成5团 / 可成10团 / 每人限购1分</Text>
                    <Text className='at-col at-col-4 text_right'>提货点：鲜丰水果</Text>
                </View>
                <View className='at-row text_three'>
                    <View className='at-col at-col-9'>
                        <Text>剩余 </Text>
                        <AtCountdown
                          className='green'
                          format={{ day: '天', hours: ':', minutes: ':', seconds: '' }}
                          isCard
                          isShowDay
                          day={2}
                          hours={1}
                          minutes={1}
                          seconds={10}
                        />
                    </View>
                    <View className='at-col at-col-3 text_right'>下单2小时后</View>
                </View>
            </View>
        </View>
        {/* current: value */}
        <View className='com_click'>
            <AtTabs current={current} tabList={tabList} onClick={handleClick.bind(this)}>
                <AtTabsPane index={0} current={current}>
                    <View style='padding: 20px 20px;' >
                        <Image src='../../../static/img/pintuanjiangli.png'></Image>
                        <View className='text_t'>
                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar sic tempor. Sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam fermentum, nulla luctus pharetra vulputate, felis tellus mollis orci, sed rhoncus pronin sapien nunc accuan eget.
                        </View>
                    </View>
                </AtTabsPane>
                <AtTabsPane index={1} current={current}>
                    <View style='padding: 20px 20px;'>
                        <View className='clustering'>
                            <Text>3人成团</Text> / <Text>已成5团</Text> / <Text>可成10团</Text>
                        </View>
                        <View className='members'>
                            <View>
                                <Text className='text'>1 团</Text>
                            </View>
                            <View className='members_mem'>
                                <View>
                                    <Image></Image>
                                    <Text>Lee （我）</Text>
                                </View>
                                <View>团了1份</View>
                                <View>2小时前</View>
                            </View>
                            <View className='members_mem'>
                                <View>
                                    <Image></Image>
                                    <Text>Lee （我）</Text>
                                </View>
                                <View>团了1份</View>
                                <View>2小时前</View>
                            </View>
                            <View className='members_mem'>
                                <View>
                                    <Image></Image>
                                    <Text>Lee （我）</Text>
                                </View>
                                <View>团了1份</View>
                                <View>2小时前</View>
                            </View>

                        </View>
                    </View>
                </AtTabsPane>
            </AtTabs>
        </View>

        <View  className='com-footer'>
          <View onClick={toBianji}>编辑拼团</View>
          <View>立即分享</View>
        </View>

    </View>

}
export default groupXiangqing;